import PropTypes from 'prop-types'
import React, { memo } from 'react'
import classNames from 'classnames'
import { TabsWrapper } from './style'

const SearchTabs = memo((props) => {
  const { tabs, curIndex, tabClick } = props

  return (
    <TabsWrapper>
      {
        tabs.map((item, index) => {
          return (
            <div
              className={classNames("item", { "active": index === curIndex })}
              onClick={e => tabClick(index)}
              key={index}
            >
              <span>{item}</span>
            </div>
          )
        })
      }
    </TabsWrapper>
  )
})

SearchTabs.propTypes = {
  tabs: PropTypes.array
}

export default SearchTabs